<template>
	<view>
		<uni-search-bar :radius="100" v-model="searchValue" @input="search"></uni-search-bar>
		<uni-table border stripe emptyText="暂无更多数据">
			<!-- 表头行 -->
			<uni-tr>
				<uni-th align="center" sortable="true">姓名</uni-th>
				<uni-th align="center">电话</uni-th>
				<uni-th align="left">身份证号码</uni-th>
				<uni-th align="left">积分</uni-th>
			</uni-tr>
			<uni-tr v-for="(item,index) in showVolunteers">
				<uni-td>{{item.name}}</uni-td>
				<uni-td>{{item.phone}}</uni-td>
				<uni-td>{{item.identify}}</uni-td>
				<uni-td>{{item.score}}</uni-td>
			</uni-tr>

		</uni-table>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchValue: '',
				volunteers:[
					{
						name: "张小凡",
						phone: "199****7890",
						identify: "500123*******7641",
						score: "1"
					},
					{
						name: "林惊羽",
						phone: "199****7890",
						identify: "500123*******7641",
						score: "2"
					},
					{
						name: "田不易",
						phone: "199****7890",
						identify: "500123*******7641",
						score: "4"
					},
					{
						name: "宋大仁",
						phone: "199****7890",
						identify: "500123*******7641",
						score: "5"
					},
				],
				showVolunteers: []
			}
		},
		onLoad() {
			this.showVolunteers = this.volunteers;
		},
		methods: {
			search(){
				if(this.searchValue){
					this.showVolunteers = this.volunteers.filter(s=>s.name.indexOf(this.searchValue)!=-1);
				}else{
					this.showVolunteers = this.volunteers;
				}
			}
		}
	}
</script>

<style>

</style>
